import { Editor } from '@tinymce/tinymce-react';
import { submit, getContent } from '@/services/home';
import { message } from 'antd';
export default () => {
  return (
    <form>
      <Editor
        init={{
          language: 'zh_CN',
          hidden_input: false,
          plugins:
            'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount linkchecker save',

          toolbar:
            'undo redo | aidialog aishortcuts | blocks fontsizeinput | bold italic | align numlist bullist | link image | table media pageembed | lineheight  outdent indent |save ', // Note: if a toolbar item requires a plugin, the item will not present in the toolbar if the plugin is not also loaded.

          content_style:
            'body { font-family: "微软雅黑", sans-serif; font-size: 14px; }',
          menu: {
            tc: {
              title: 'Comments',
              items: 'addcomment showcomments deleteallconversations',
            },
          },
          height: 500,
          setup: function (editor) {
            // 监听 BeforeExecCommand 事件
            editor.on('BeforeExecCommand', function (e) {
              // 如果是保存命令
              if (e.command === 'mceSave') {
                // 阻止默认行为
                e.preventDefault();
                submit({
                  content: editor.getContent(),
                }).then(() => {
                  message.success('保存成功');
                });
                // 在这里编写你自己的保存逻辑
              }
            });
          },
          init_instance_callback: (editor) => {
            getContent().then(({ content }) => {
              editor.setContent(content);
            });
          },
        }}
        apiKey="nv9ggnlh19xx9chhbowa3xf6s7dl8newel96s7pmi8rdxu5h"
      ></Editor>
    </form>
  );
};
